<?php
	require_once 'config.php';
?>
<!DOCTYPE html> 
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">

<title>CallawayGarden</title>
  <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDE5bxI9OIDz8IVlIxmyUTvF1GSPzcYAys&sensor=true"></script>
    <link rel="stylesheet"  href="css/themes/default/jquery.mobile-1.3.1.css">
	<link rel="stylesheet" href="_assets/css/jqm-demos.css">
	<link rel="shortcut icon" href="favicon.ico">
    <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,700">
	<script src="js/jquery.js"></script>
	<script src="_assets/js/index.js"></script>
	<script src="js/jquery.mobile-1.3.1.min.js"></script>
    
    <!-- ios slider-->
    
	<!-- CSS -->
	<link rel = "stylesheet" href = "./iosslider/default.css" />
	<link rel = "stylesheet" media = "screen" href = "./iosslider/common.css" />
		
	<!-- JS --> 
	<script src = "./iosslider/jquery.easing-1.3.js"></script>
		
	<!-- iosSlider plugin -->
	<script src = "./iosslider/jquery.iosslider.js"></script> 
    
    <script type="text/javascript">
			$(document).ready(function() {
				
				$('.iosSlider').iosSlider({
					snapToChildren: true,
					desktopClickDrag: true,
					keyboardControls: true, 
					navSlideSelector: $('.selectors .item'),
					onSlideChange: slideChange
				});
				
				$('.ui-btn-inner').click(function(){
					$('span[class^="ui-btn-inner"]').removeAttr('style'); 
					 $(this).css("color", "#f57c5a"); 
				});
			}); 
			
			function slideChange(args) {
				
				$('.selectors .item').removeClass('selected');
				$('.selectors .item:eq(' + (args.currentSlideNumber - 1) + ')').addClass('selected');
				
			}
	</script>
    
    <style>
			#SecondNested {
				margin-left: 20px;
			}
			
			#ThirdNested {
				margin-left: 20px;
			}
			 
			.ui-collapsible-heading .ui-icon {
			    display: none;
			}
			
		 
	</style> 
    
</head>